import Vue from 'vue'
import VueRouter from 'vue-router'
import AppLayout from '@/layouts/AppLayout'
import { getUserInfo } from '@/api/system'
const Login = () => import('@/views/login')
const Error = () => import('@/views/error')

Vue.use(VueRouter)

const router = new VueRouter({
  base: process.env.VUE_APP_CONTEXT_PATH + (process.env.VUE_APP_ROUTER_MODE === 'hash' ? '#' : ''),
  mode: process.env.VUE_APP_ROUTER_MODE,
  routes: [
    // 登录
    {
      name: 'login',
      path: '/login',
      component: Login
    },
    // 错误页
    {
      name: 'error',
      path: '/error/:type',
      component: Error
    },
    // 内容页（动态加载）
    {
      name: 'layout',
      path: '',
      component: AppLayout,
      children: [
        // iframe嵌入页
        {
          path: 'iframe',
          name: 'IFrame',
          component: () => import('@/views/iframe')
        }
      ]
    }
  ]
})
router.beforeEach((to, from, next) => {
  // 无权访问&404页面可直接访问
  if (to.name === 'login' || to.name === 'error') {
    next()
    return
  }
  // 如果访问的是layout（回退时可能存在该情况），直接调整至首页
  if (to.name === 'layout') {
    next({ name: 'index' })
    return
  }
  // 验证用户是否登录
  const userInfo = router.app.$options.store.state.userInfo
  if (userInfo != null) {
    // 如果访问的是登录页面，则直接跳转至首页
    if (to.name === 'login') {
      next({ name: 'index' })
      return
    }
    next()
    return
  }
  getUserInfo()
    .then(userInfo => {
      // 初始化客户端配置
      router.app.$store.dispatch('initClientConfig')
        .then(config => {
          // 存储userInfo
          router.app.$store.commit('setUserInfo', userInfo)
          // 存储客户端配置
          router.app.$store.commit('setClientConfig', config)
          next()
        })
        .catch(() => {
          next({
            name: 'error',
            params: {
              type: 'config-load-failed'
            }
          })
        })
    })
    .catch(() => {
      next({ name: 'login' })
    })
})

export default router
